<template>
    <div class="cont">
        <h2>{{msg}}</h2>
        <hr />
        <h3>{{$store.state.count}}-{{count}}</h3>
        <p>
            <button @click="$store.commit('add',10)" >+</button>
            <button @click="$store.commit('remove')">-</button>
        </p>
    </div>    

</template>
<script>
import store from '../store/store.js'
import {mapState,mapMutations } from 'vuex'


export default {
    data () {
        return {
            msg:'帅气的王子'
        }
    },
    computed:mapState(['count']),
    //第二个方法
    // {
    //     count (){
    //         return this.$store.state.count
    //     }
    // },
    //第3个方法
    // mapState({
    //     count:state=>state.count
    // }),
    
    methods:mapMutations([
        'add','remove'
    ]),
    store
}
</script>


